import React, {Component} from 'react'
import {connect} from 'react-redux'
import { Link } from "react-router-dom"
import { Button, Toast } from 'antd-mobile'
import Header from "../components/header"
import {loadAllPayList,payOnlineQuickWX,payOnlineQuickAP} from "../redux/actions/userAction"

export class wxPayQuick extends Component {
  constructor (props){
   super(props)
   this.state= {
     title:""
   }
}

  componentWillUpdate(){
    // 从user中拿取companyChargeChannel 渲染页面

  }

  charge(){
    let money = this.refs.money.value;
    if(!money){
     return Toast.fail('请输入充值金额')
    }
    // if(money%100 !==0){
    //  return Toast.fail("充值金额必须为100的倍数")
    // }
    const {dispatch,match,user} = this.props
    const {key} = match.params
    let {payValue,thirdPayId,payType,payMaxEdu,payMinEdu} = user.get("allpaylist").thirdPayKjList[key-1]
    if(money>payMaxEdu || money<payMinEdu){
     return Toast.fail("充值金额只能在"+payMinEdu+"~"+payMaxEdu+"之间")
    }
    // "{'m':'WEIXINWAP','pc':'WEIXIN'}" 单引号json.parse不能转换
    let str = payValue.replace(/\'/g,`"`)
    let bankCode = JSON.parse(str).m
    if(key==2){
      let pdFrpId = "pdFrpId-Parameter"
      let pa7CardAmt = "pa7CardAmt-Parameter"
      let pa8CardNo = "pa8CardNo-Parameter"
      let pa9CardPwd = "pa9CardPwd-Parameter"
      dispatch(payOnlineQuickAP(money,bankCode,thirdPayId,payValue,payType,pdFrpId,pa7CardAmt,pa8CardNo,pa9CardPwd,(ok,data)=>{
        alert(data.msg)
      }))
    }else{
      dispatch(payOnlineQuickWX(money,bankCode,thirdPayId,payValue,payType,(ok,data)=>{
        alert(data.msg)
      }))
    }
   

  }

  componentDidMount(){
    const {user,dispatch,match} = this.props
    let title =  match.params.key ==1 ? "微信" : "支付宝"
    this.setState({
      title
    })
    Object.keys(user.get("allpaylist")).length==0 && dispatch(loadAllPayList())
  }

   render() {
    // const {user,match} = this.props
    // const {key} = match.params
    // var title = Object.keys(user.get("allpaylist")).length>0 && user.get("allpaylist").thirdPayKjList[key].payName
   return <div className="withdraw pay">
          <Header title={this.state.title+"扫码支付"} {...this.props}></Header>
          <div className="withdraw-contanier">
        <div className="withdrawbody">
          <div className="form-group form-group-depth-1 form-group-bank">
          <label className="control-label">充值金额:</label>
            <input type="number" placeholder="请填写充值金额" ref="money"/>
          </div>    
        </div>
          <div className="basepage">
            <Button type="primary"  onClick={this.charge.bind(this)} >确认充值</Button>
          </div>
        </div>
      </div>
   }
}

function mapStateToProps(state) {
  return {
    user: state.user
  }
}

export default connect(mapStateToProps)(wxPayQuick)